
  if(!window.getI18NString){getI18NString = function(s){return s;}}

var powerNet = new PowerNet({
  target: 'canvas',
  editable: true
})

// 工具栏
var toolbar = Q.createToolbar(null, $("#toolbar")[0]);
// 缩略图
var overview = new Q.Overview($('#overview')[0]);
// 右键菜单
var menu = new Q.PopupMenu();

// 显示JSON
$('#btnJSONShow').click(function () {
  showJSONPanel();
})
// 显示缩略图
$('#btnOverview').click(function(){
    var visible = !overview.visible;
    overview.setVisible(visible);
    overview.setGraph(visible ? window.graph : null);
})
var maximize = $('#maximize')[0];
maximize.onclick = function(){
  if($('#graph_panel').hasClass('q-max')){
      $('#graph_panel').removeClass('q-max');
      $(maximize).removeClass('active');
  }else{
      $('#graph_panel').addClass('q-max');
      $(maximize).addClass('active');
  }
  if(window.graph){
    window.graph.updateViewport();
  }
}

var ws = new WebSocket("ws://" + location.hostname + ":7002/ws/power/1");

var wsPowerNet = new WsPowerNet(ws, powerNet)

ws.onopen = function (evt) {
  console.log("ws.onopen", evt);
  wsPowerNet.sendInitGraph()
};

ws.onmessage = function (evt) {
  console.log("ws.onmessage", evt.data);
  var msg = JSON.parse(evt.data)
  wsPowerNet.handle(msg.Subject, msg.Data)

  if(msg.Subject == 'graph_init'){
    toolbar.setGraph(powerNet.graph)
    overview.setGraph(powerNet.graph);
    powerNet.graph.popupmenu = menu;
    window.graph = powerNet.graph
  }
};

ws.onclose = function (evt) {
  console.log("ws.onclose", evt);
};
ws.onerror = function (evt) {
  console.log("ws.onerror", evt);
};


function showJSONPanel(show) {
  var isShowing = $("#Q-JSON-Panel")[0].clientHeight > 10;
  if (show === undefined) {
      return showJSONPanel(!isShowing);
  }
  if (isShowing === show) {
      return;
  }
  $("#Q-JSON-Panel").animate({height: isShowing ? "0" : "100%"});
  if (!isShowing) {
      json_code_panel.value = powerNet.graph.exportJSON(true);
  }
}



$('#btnAddElement').click(function () {
	wsPowerNet.sendNewNode(1,0,0)
})